<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>课工场</title>
		<style>
			*{
				margin: 0;
				padding: 0;
			}
			a{
				text-decoration: none;
				color:black;
			}
			li{
				list-style: none;
			}
			body>div{
				border:1px solid red;
			}
			#top{
				display: flex;
				justify-content: space-between;
				height: 30px;
				font-size: 14px;
				line-height: 30px;
				
			}
			#top #left{
				margin-left: 30px;
			}
			#top #left a{
				margin-left: 10px; 
				margin-right: 15px;
			}
			#top #right a{
				display: inline-block;
				width: 100px;
				/* background-color: brown; */
			}
			#top #right a#mobile span.f1{
				background: url(icon.png) no-repeat  0 -10px;
				width: 15px; 
			}
			#top #right a#mobile span.f2{
				background: url(icon.png) no-repeat  0 -35px;
				width: 15px; 
				margin-left: 5px;
			}
			#top #right .wechatimg{
				display: none;
			}
			#top #right a#mobile:hover .wechatimg{
				display: block;
			}
		</style>
	</head>
	<body>
		<div id="top">
			<div id="left">
				<a href="#">首页</a>|<a href="#">加入收藏</a>
			</div>
			<div id="right">
				<a href="#" id="mobile"><span class="f1">&nbsp;&nbsp;&nbsp;</span>手机网<span class="f2">&nbsp;&nbsp;</span>
				<img src="qr-code-wx.png" class="wechatimg"/>
				</a><a id="wechat" href="#">微信</a>
			</div>
		</div>
		<div id="nav">
			
		</div>
		<div id="nav2"></div>
		<div id="crui"></div>
		<div id="plan"></div>
		<div id="news"></div>
		<div id="course"></div>
		<div id="needforjoin"></div>
		<div id="institute"></div>
		<div id="student"></div>
		<div id="job"></div>
		<div id="link"></div>
		<div id="bottom"></div>
		<div id="footer"></div>
	</body>
</html>